<template>
  <view class="bodyView">
    <view class="head-view padding-sm margin-xs">
      <view class="textView">团队统计</view>
      <view class="numberView">90909<font class="text-df text-gray">元</font></view>
    </view>
    <view>
      <view class="flex">
        <view class="flex-sub bg-cutomer padding-sm margin-xs radius">
          <view>
            690000 <font class="text-df">预计总金额(元)</font>
          </view>
          <view>
            <view class="cu-progress radius striped active">
              <view class="bg-red" :style="[{ width:'40%'}]">40%</view>
              <view class="bg-cyan" :style="[{ width:'60%'}]">60%</view>
            </view>
          </view>
          <view>
            <view class="flex">
              <view class="flex-sub  padding-sm margin-xs radius">
                到账:47800元
              </view>
              <view class="flex-sub  padding-sm margin-xs radius">
                未到账:7800元
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="">
      <view class="flex text-center bg-white nav">
          <view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in itemList" :key="index" @tap="tabSelect" :data-id="index">
            {{item.name}}
          </view>
      </view>
      <view class="cu-list menu margin-sm">
          <view class="cu-item" v-if="TabCur == 0" v-for="(item,idx) in myShops" :key="idx"  @click="gotoShopInfo(item.id)">
            <view class="flex-sub">
              <view class="text-grey">【{{item.adminName}}】 {{item.poiName}} </view>
              <view class="text-gray text-sm flex">
                <view class="text-cut">
                  <text class="cuIcon-infofill text-green  margin-right-xs"></text>
                  {{item.address}}
                </view>
              </view>
            </view>
        </view>
        <view v-if="TabCur == 1">
          {{1}}
        </view>
        <view v-if="TabCur == 2">
          {{2}}
        </view>
        <view v-if="TabCur == 3">
          {{3}}
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import {getShopList} from '../../common/api/shop'
export default {
name: "myTeam",
  data() {
    return {
      myShops:[],
      TabCur: 0,
      itemList:[{'name':'团队成员','idx':'0'},{'name':'团队订单','idx':'1'},{'name':'团队核销','idx':'2'},{'name':'商户','idx':'3'}]
    };
  },
  methods: {
    tabSelect(e){
      this.TabCur = e.currentTarget.dataset.id;
      console.log('idx:',e.currentTarget.dataset.id)
    },
    async getList() {
      // const id = store.userId?store.userId:1
      const id = 1
      await getShopList(id).then(res => {
        if (res.code == 200) {
          // allShops.value = res.data.allShops;
          this.myShops = res.data.myShops;
          // groupShops.value = res.data.groupShops;
        }
      })
    },
    gotoShopInfo(id){
      uni.navigateTo({url: `/pages/shop/shopInfo?id=${id}`})
    }
  },
  mounted() {
      this.getList()
  }
}
</script>

<style lang="scss" scoped>
.bodyView {
  margin: 20rpx;
  .head-view {
    display: flex;
    .textView {
      flex: 9;
    }
    .numberView {
      color: #e39031;
    }
  }

  .font14 {
    font-size: 22rpx;
  }
  .bg-cutomer {
    background: rgb(226 144 87 / 70%);
    color: white;
  }
}


</style>